import React,{useEffect, useState} from 'react'
import { useNavigate, useParams } from 'react-router-dom'
import axios from 'axios'
export default function Jie() {
    const Navigate=useNavigate()
    const params=useParams()
    const [list1,setList1]=useState([{}])
    const getlist=async()=>{
        const res=await axios.get(`http://localhost:3000/getdanshu?name=${params.id}`)
        setList1(res.data.list)
        console.log(res.data.list)
    }
    useEffect(()=>{
        getlist()
    })
  return (
    <div>
 <p style={{marginTop:'10px',width:'90%',paddingTop:'10px',marginLeft:'40px',height:'30px'}}>  <span style={{fontSize:'25px',float:'left',paddingTop:'0px',marginRight:'15px'}} onClick={()=>{
        Navigate(-1)
    }}>&lt;</span> <input placeholder='搜索动态关键字' onFocus={()=>{
        Navigate("/app/search")
    }} value={params.id} style={{width:'200px',height:'20px',backgroundColor:'rgb(247, 247, 247)',borderRadius:'20px',paddingLeft:'10px',float:'left'}}></input>
       
       <button style={{backgroundColor:'rgb(36, 200, 116)',color:'white',height:'28px',width:'60px',marginLeft:'10px',borderRadius:'25px',border:'0px',float:'left'}}>搜索</button>
       </p>
       
       <div style={{backgroundColor:'rgb(247,247,247)',width:'99vw',height:'100vh',marginLeft:'-10px'}}>
            {list1.map(item=>{
                return   <div onClick={()=>{
                    Navigate(`/app/dan/${item._id}`)
                }} style={{width:'38%',height:'230px',display:'inline-block',margin:'15px'
                  ,backgroundColor:'white',paddingBottom:"5px",paddingLeft:'5px',paddingRight:'5px',borderRadius:'5px'
                  
                }}>
                <p ><img src={item.img} style={{width:'100%',borderTopLeftRadius:'10px',borderTopRightRadius:'10px',height:'100%'}}></img></p>
                <p>{item.test}</p>
                <p style={{marginTop:'16px'}}>
                    
                    <img src={item.img} style={{width:'20px',float:'left',height:'20px',borderRadius:'50%'}}></img>
                    <span>{item.name}</span>
                    <span style={{float:'right'}}>{item.praisenum} 👍</span>
                </p>
            
            </div>
            })}
          
            
        </div>
       











    </div>
  )
}
